<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">
		<meta http-equiv="pragma" content="no-cache">
		<script type="text/javascript" src="js/tools/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="js/tools/jqueryurl.js"></script>
<script type="text/javascript" src="js/tools/public.js"></script>
<script charset="utf-8" src="admin/js/public.js"></script>
<style>
table {font-size: 12px;}
table tr {background-color: #F1F6F6;}
table tr td {border: 1px solid #D9D9D9;color: black;padding: 2px;}
</style>
<script type="text/javascript">
var user='<s:property value="#session.user"/>';
var map;
var flag=0;
var marker1=null;
var marker2=null;
function initialize(){
          var startLat='<s:property value="loads.startLat"/>';
		 var startLng='<s:property value="loads.startLng"/>';
		 if(startLat==''||startLng=='')
		 {
		    startLat='36.73888412439431';
		    startLng='97.14111328125';
		 }
    var myLatlng =new google.maps.LatLng(parseFloat(startLat),parseFloat(startLng));
    var myOptions = {
        zoom: 10,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    google.maps.event.addListener(map,'click',function(event){
      if(flag==0)
      {
       $("#startLng").val(event.latLng.lng());
       $("#startLat").val(event.latLng.lat());
       if(marker1==null)
			{
				 marker1 = new google.maps.Marker({       
			position: event.latLng,   
			icon:"http://maps.gstatic.cn/mapfiles/icon_greenA.png",           
			map: map});
			}else
			{
				 marker1.setPosition(event.latLng);
			}
       }else
       {
       $("#endLng").val(event.latLng.lng());
       $("#endLat").val(event.latLng.lat());
       if(marker2==null)
			{
				 marker2 = new google.maps.Marker({       
			position: event.latLng, 
			icon:"http://maps.gstatic.cn/mapfiles/icon_greenB.png",      
			map: map});
			}else
			{
				 marker2.setPosition(event.latLng);
			}
       }
    });
    
    var loads='<s:property value="loads"/>';
	if(loads!="")
	{
	   var provinceId='<s:property value="loads.provinceId"/>';
	   var cityId='<s:property value="loads.cityId"/>';
	   var countiesId='<s:property value="loads.countiesId"/>';
	   
	    provinceList("provinceId",function(){
	         $("#provinceId").val(provinceId);
	     });
	     cityList("cityId",provinceId,function(){
	         $("#cityId").val(cityId);
	     });
	     countiesList("countiesId",cityId,function(){
	        $("#countiesId").val(countiesId);
	     })
	     
	     var startLat='<s:property value="loads.startLat"/>';
		 var startLng='<s:property value="loads.startLng"/>';
	    marker1 = new google.maps.Marker({       
			position:new google.maps.LatLng(parseFloat(startLat),parseFloat(startLng)),   
			icon:"http://maps.gstatic.cn/mapfiles/icon_greenA.png",           
			map: map});
			
			var endLat='<s:property value="loads.endLat"/>';
			var endLng='<s:property value="loads.endLng"/>';
			
		marker2 = new google.maps.Marker({       
			position: new google.maps.LatLng(parseFloat(endLat),parseFloat(endLng)), 
			icon:"http://maps.gstatic.cn/mapfiles/icon_greenB.png",      
			map: map});
	}else
	{
	  var location='<s:property value="#session.location"/>';
		if(location!="")
		{
		   location=location.split(",");
		    provinceList("provinceId",function(){
		         $("#provinceId").val(location[0]);
		     });
		     cityList("cityId",provinceId,function(){
		         $("#cityId").val(location[1]);
		     });
		     countiesList("countiesId",cityId,function(){
		        $("#countiesId").val(location[2]);
		        moveMap($("#countiesId").find('option:selected').text(),12);
		     })
		}else
		  {
		     provinceList("provinceId");
		  }
		
	}
}

//移动地图
function moveMap(keyword,level)
{
   
   var geocoder = new google.maps.Geocoder();
			geocoder.geocode( { 'address': keyword}, function(results, status) {
		      if (status == google.maps.GeocoderStatus.OK) {
		        map.setCenter(results[0].geometry.location);
				map.setZoom(level);
		      } 
		    });
}
function check()
{
   $("#loadName,#lat,#lng").css("border","");
   var countiesId=$("#countiesId").val();
   var loadName=$.trim($("#loadName").val());
   var startLat=$("#startLat").val();
   var startLng=$("#startLng").val();
   var endLat=$("#endLat").val();
   var endLng=$("#endLng").val();
   if(countiesId==null||countiesId==-1)
   {
     alert("请选择地址");
     return false;
   }
   if(loadName.length<1||loadName.length>30)
   {
     $("#loadName").css({"border": "2px solid red"});
      alert("路名的长度为1~30");
      return false;
   }
   if(startLat==""||startLng==""||endLat==""||endLng=="")
   {
     $("#lng").css({"border": "2px solid red"});
      alert("路的起止经度不能为空");
      return false;
   }
  return true;
};


</script>
	</head>
	<body onload="initialize()">
	<s:actionmessage/>
	<s:if test="%{loads == null}">
	    <form action="dic!addLoad.action" method="post" onsubmit="return check();">
	</s:if>
	<s:else>
	     <form action="dic!modifyLoads.action" method="post" onsubmit="return check();">
	     <input type="hidden" name="loads.id" value="<s:property value="loads.id"  />">
	</s:else>
	 <input type="hidden" name="columnId" id="columnId" value="">
		<table  style="width: 98%;" align="center">
			<tr><td width="10%">地区：</td><td>省：<select id="provinceId" name="loads.provinceId" onchange="cityList('cityId',$(this).val(),function(){moveMap($('select[name=loads.provinceId] option[selected]').text(),8);})" style="width:100px;"></select>
			市：<select id="cityId" name="loads.cityId" onchange="countiesList('countiesId',$(this).val(),function(){moveMap($('select[name=loads.provinceId] option[selected]').text()+$('select[name=loads.cityId] option[selected]').text(),11);})" style="width:100px;"></select>
			区（县）：<select id="countiesId" name="loads.countiesId" onchange="loadsList('loadId',$('#provinceId').val(),$('#cityId').val(),$('#countiesId').val(),function(){moveMap($('select[name=loads.provinceId] option[selected]').text()+$('select[name=loads.cityId] option[selected]').text()+$('select[name=loads.countiesId] option[selected]').text(),12);})" style="width:100px;"></select></td></tr>
			<tr><td width="10%">路名：</td><td><input type="text" id="loadName" name="loads.loadName" value="<s:property value="loads.loadName"/>" /></td></tr>
			<tr><td width="10%">起点经纬度：</td><td><input type="text" id="startLng" name="loads.startLng"  value="<s:property value="loads.startLng"/>"/><input type="text" id="startLat" name="loads.startLat" value="<s:property value="loads.startLat"/>"/><a href="javascript:void(0);" onclick="flag=0">添加</a></td></tr>
			<tr><td width="10%">终点经纬度：</td><td><input type="text" id="endLng" name="loads.endLng"  value="<s:property value="loads.endLng"/>"/><input type="text" id="endLat" name="loads.endLat"  value="<s:property value="loads.endLat"/>"/><a href="javascript:void(0);" onclick="flag=1">添加</a></td></tr>
			<tr><td width="10%">地图：</td><td><div style="width:450px;height:300px;" id="map_canvas"></div></td></tr>
			<tr><td><input type="submit" value="保存"/></td><td></td></tr>
		</table>
	</form>
	</body>
</html>
